<template>
  <div style="width: 1200px;margin: 0 auto">
    <el-row :gutter="10">
      <el-col :span="4">
        <el-menu router active-text-color="#ffd04b"
                 background-color="#545c64"
                 text-color="#fff">
          <el-sub-menu index="1">
            <template #title>
              <el-icon>
                <Menu/>
              </el-icon>
              <span>医院概况</span>
            </template>
            <el-menu-item class="menuI" index="/HospitalIndex" :id="($route.path==='/HospitalIndex')?'menuC':''">
              信息
            </el-menu-item>
          </el-sub-menu>
        </el-menu>
      </el-col>
      <el-col :span="20">
        <img src="imgS/yiyuan.jpg" width="1000">
        <div style="white-space: pre-line;text-align: left;">{{ index.content }}</div>
      </el-col>
    </el-row>
  </div>

</template>

<script setup>
import {ref} from "vue";

const index = ref({content:"位于中国湖北的达内医院是一家综合性医疗机构，拥有先进的设施和专业的医疗团队，为患者提供全面的医疗服务。医院建立于20世纪90年代，经过多年的发展，已成为该地区的医疗健康中心。\n" +
      "\n" +
      "达内医院占地面积约20,000平方米，拥有现代化的医疗设施和设备，包括多个科室、手术室、急诊室和住院部等。医院引进了国际先进的医疗设备，并采用数字化信息管理系统，使医疗服务更加高效和便捷。\n" +
      "\n" +
      "医院拥有一支由资深专家和经验丰富的医护人员组成的团队。其中包括一批具有国际学术背景和临床经验的专家，涵盖内科、外科、妇产科、儿科、骨科、口腔科等多个医疗领域。此外，医院还注重医护人员的培训和进修，确保他们始终保持专业水准。\n" +
      "\n" +
      "在服务方面，XX医院致力于提供患者为中心的医疗护理。医院建立了一套完善的就诊流程和服务体系，包括预约挂号、门诊就诊、住院护理等环节，以确保每一位患者都能够得到及时、有效的医疗服务。\n" +
      "\n" +
      "除了常规的医疗服务外，XX医院还开展了多项社区健康促进活动，包括义诊、健康讲座、健康体检等，积极倡导健康生活方式，提高社区居民的健康意识。\n" +
      "\n" +
      "未来，达内医院将继续致力于提高医疗水平，不断引进先进技术和治疗方案，为患者提供更加优质的医疗服务。同时，医院也将进一步加强与国际医疗机构的合作交流，推动医疗科研和学术交流，为推动当地医疗事业的发展贡献力量。"})
</script>

<style scoped>
.menuI {
  width: 190px;
  height: 60px;
  padding-left: 20px!important;
  padding-right: 0;
  line-height: 100px;
  font-size: 24px;
  color: black;
  transition: all 0.5s ease-in-out;
  transition-delay: 0.1s; /* 添加延迟 */
}
.menuI.is-active {
  width: 170px;
  height: 40px;
  margin-left: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  border-radius: 50px 0 0 50px;
  background-color: rgba(255, 255, 255, 0.9);
}

#menuC {
  width: 170px;
  height: 40px;
  margin-left: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  border-radius: 50px 0 0 50px;
  background-color: rgba(255, 255, 255, 0.9);
}
</style>